<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>获取缩率图MediaID - PowerBy Wefee.CC</title>
    <link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
    <script src="/static/require.js"></script>
    <script src="/static/main.js"></script>
    <style>
        h3 { line-height: 160px; background-color: #16987e; color: #FFF; margin: 0px; font-family: "Microsoft Yahei"; margin-bottom: 20px; }
        li { list-style: none; }
    </style>
</head>
<body>

{:token()}

<h3 class="text-center">获取缩率图MediaID</h3>

<div class="container">
    <div class="row">
        <div class="col-lg-12 form-horizontal">
            <div class="form-group">
                <label class="control-label col-sm-2">选择文件</label>
                <div class="col-sm-8">
                    <div class="input-group">
                        <input type="text" name="thumb_media_id" class="form-control" placeholder="请选择文件" disabled>
                        <div class="input-group-addon select-file" style="cursor: pointer;">选择文件</div>
                    </div>
                    <div style="display: none" id="select-file"></div>
                </div>
            </div>
        </div>

        <div class="col-lg-12">
            <div class="alert alert-warning">
                <p><b>注意：</b></p>
                <p> 缩略图（thumb）：64KB，支持JPG格式</p>
            </div>
        </div>

    </div>
</div>

<script>require(['bootstrap'])</script>
<script>
    require(['jquery', 'webuploader'], function ($, wu) {
        $('.select-file').click(function () {
            $('#select-file input[name="file"]').click();
        });
        var uploader = wu.create({
            auto: true,
            server: "{:url('wechat/service/uploadThumb')}",
            pick: {
                id: '#select-file',
                multiple: false
            },
            accept: {
                title: 'Thumb',
                extensions: 'jpg'
            }
        });
        uploader.on('uploadSuccess', function(file, response) {
            if (typeof (response.error) != 'undefined') {
                alert(response.error);
                return ;
            }
            $('input[name="thumb_media_id"]').val(response.success);
        });
    });
</script>
</body>
</html>